// Variable Color's
$background: #1A1B26;
$foreground: #A9B1D6;

$black: #24283B;
$gray: #565F89;
$red: #F7768E;
$green: #73DACA;
$yellow: #E0AF68;
$blue: #7AA2F7;
$magenta: #BB9AF7;
$cyan: #7DCFFF;
$white: #f6ffe0;

*{
    font-family: "JetbrainsMono Nerd Font";
}

/** tooltip!! **/
tooltip.background {
    background-color: $black;
    font-size: 15;
    border-radius: 10px;
    color: $foreground;
}

tooltip label {
    margin: 5px 3px 3px;
}

// Calendar
.cal-box {
    background-color: $black;
    font-size: 1em;
    font-weight: bold;
    border-radius: 10px;
    .cal-inner-box {
        padding: 1rem 1rem .2rem;
        .cal {
            &.highlight {
                padding: 10rem;
            }
            padding: .8rem .25rem 0rem;
            margin-left: 10px;
        }
    }
}

calendar:selected {
    color: $yellow;
    font-weight: bold;
}

calendar.header {
    color: $red;
    font-weight: bold;
}

calendar.button {
    color: $magenta;
}

calendar.highlight {
    color: $magenta;
    font-weight: bold;
}

calendar:indeterminate {
    color: $gray;
    font-weight: normal;
}

.separ {
    color: $gray;
    font-weight: bold;
    font-size: 20px;
    margin: 5px 5px 0px 5px;
}
